<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="pub/top.jsp"%>
<!-- 全局变量 函数定义区 -->
<%!%>
<!-- 实例变量 函数定义区 -->
<%
	//网页title
	String JSPTITLE = "";
%>
<%@ include file="pub/head2.jsp"%>
<!-- 样式添加区 -->
<style>

.fa-times {
	z-index: 999
}

.iframeAll {
	display: none;
	frameborder: "no";
	border: 0;
	marginwidth: 0;
	marginheight: "0"
}

.ifcheck {
	display: block
}
</style>
<%@ include file="pub/left.jsp"%>
<link rel="stylesheet" href="<%=basePath%>assets/css/jquery.gritter.min.css" />
<link rel="stylesheet" href="<%=basePath%>assets/css/bootstrap-editable.min.css" />
<!-- 下右内容区 -->
<div class="main-content-inner">
 <div class="breadcrumbs ace-save-state" id="breadcrumbs">
  <ul id="inbox-tabs" class="inbox-tabs nav nav-tabs padding-16 tab-size-bigger tab-space-1">
  </ul>
 </div>
 <div class="page-content">
  <div class="row">
   <div style="width: 100%" id="iframediv"></div>
  </div>
 </div>
</div>
<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
 <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
</a>
<!-- 用于标记c2c的id -->
<input type="text" style="display: none" id="c2cid">
<%@ include file="pub/bottom.jsp"%>
<!-- 扩展脚本 加载区 -->
<%@ include file="pub/listjs.jsp"%>
<script >
var HYLTAB={
    menu:null,
    menuid:null,
    selectmenu:null,
    save:function(){    
      var jsonStr = JSON.stringify( this.menu);
      window.sessionStorage.setItem("menu", jsonStr);
      window.sessionStorage.setItem("menuid", this.menuid);
    },
    saveSelect:function(id){
      if (id)
        this.selectmenu=id;      
      else   
        this.selectmenu=100;
      window.sessionStorage.setItem("selectmenu", this.selectmenu);
    },
    loadTabs:function(){    
      this.menu = JSON.parse(window.sessionStorage.getItem("menu"))||[{
          id:100,
          title : "主页",
          url : "table.jsp"
          }];      
      this.selectmenu=window.sessionStorage.getItem("selectmenu")||100;
      this.menuid=window.sessionStorage.getItem("menuid")||100;
      //console.log(this.menu);
    },  
    //创建tabmenu
    createTab:function(data, href){
      if (!data||data==undefined) return null;
      if (!href||href==undefined) return null;
      this.menuid++;
      var obj = {
          id: this. menuid,
          title : data,
          url : href
         };
      this.menu.push(obj);
      this.saveSelect(this.menuid);
      this.save();
      return this.menuid;
    },
    //根据索引删除tabmenu
    delTabByIndex:function(i){
       if (i==0) return ;
       this.menu.splice(i,1); 
       if (this.menu.length==1)
       {
         this.menuid=100;
         this.saveSelect();
       }
       this.save();
    } ,
    //根据标题获得工具栏元素的索引
    getTabIndexByTitle:function(title){
      for (var i = 0; i < this.menu.length; i++) {
        var name = this.menu[i].title;
        if (name == title) {
         return i;
        } else {
         continue;
        }
       }
      return -1;
    },
    //根据ID获得工具栏元素的索引
    getTabIndexByID:function(id){
      for (var i = 0; i < this.menu.length; i++) {
        var name = this.menu[i].id;
        if (name == id) {
         return i;
        } else {
         continue;
        }
       }
      return -1;
    },
    //根据工具栏元素的索引获得元素按钮
    getTabByIndex:function(i){
      return this.menu[i];
    },
    //判断id是否在工具栏中,如果存在返回元素按钮的id,否则返回主页id
    getDirectID:function(id2){
      for (var i = 0; i < this.menu.length; i++) {
        var id1 = this.menu[i].id;
        if (id1 == id2) {        
         this.saveSelect(id2);
         return id2;
        } else {
         continue;
        }
       }
      this.saveSelect();
      return this.selectmenu;
    },
    getLength:function(){
     // console.log(this.menu);
      return this.menu.length;
    }
  }


</script>
<script>
var hei = parseInt(window.innerHeight);
//激活工具栏按钮和对应的iframe
  var activeMenu = function(e, ddid) {
    jQuery(e).attr("aria-expanded", "true");
    jQuery(e).find('i').show();
    jQuery(e).parent('li').addClass('active');
    jQuery('#iframeinfo' + ddid).addClass('ifcheck');//给首页iframe加上选中
   // console.log("activeMenu" + ddid);
  }
//隐藏工具栏按钮和对应的iframe
  var hideMenu = function(e, ddid) {
    jQuery(e).attr("aria-expanded", "false");
    jQuery(e).parent('li').removeClass('active');
    jQuery(e).find('i').hide();
    jQuery('#iframeinfo' + ddid).removeClass('ifcheck');
  }
  //清空 工具栏的选中 css, 如果传入ddid 该ddid 的元素active
  var clear = function(ddid) {//用于清空其他的li标签选中状态
    jQuery('#inbox-tabs li a').each(function(index,e) {
      var did1 = jQuery(this).data('ddid');    
      if (ddid && did1 == ddid) {
        activeMenu(this, ddid);
      }else{
        hideMenu(this,did1);
      }
    });
  }
  //创建iframe
  var creatIframe = function(ddid, titleName, href, flag) {
    var inbox = '<li class="submenu_item " ><a data-ddid="'+ddid+'" data-toggle="tab" href="#inbox" data-sx="blank" data-target="inbox" aria-expanded="false"><span class="bigger-110">'
        + titleName + '</span>';
    if (ddid != null && ddid > 100) {
      //选中以后才有叉叉可关闭             
      inbox = inbox + '<i class="ace-icon fa fa-times" ></i>';
    }
    inbox = inbox + '</a></li>';
  //  console.log(inbox)
    jQuery('#inbox-tabs').append(inbox);
    jQuery('#iframediv').append(
        '<iframe id="iframeinfo' + ddid + '" class="iframeAll" src="' + href
            + '" style="width:100%;height:'+hei+'px"></iframe>');
  }
  //跳转到点击的窗口
  var directMenu = function(ddid) {
    ddid = HYLTAB.getDirectID(ddid);
    clear(ddid);
  }
  //删除li标签
  var deletehtml = function(ddid) {
    jQuery('#iframeinfo' + ddid).remove();
    jQuery(".submenu_item.active").remove();
    var indx = HYLTAB.getTabIndexByID(ddid);
    HYLTAB.delTabByIndex(indx);
    directMenu(ddid - 1);
  }
  jQuery(function($) {
    //左侧主页按钮事件
    $(".nav-list .main").click(function(e) {
      directMenu(100);
    });
    
    //所有左侧菜单按钮事件
    $(".nav-list li .submenu li a").each(function() {
      var that = this;
      $(that).click(function(e) {
        e.stopPropagation();
        if (HYLTAB.getLength() > 9) {
          alert("任务最多开启10个");
          clear();
          return false;
        }
        var title = $(that).text().replace(/\s*/g, "");
        var href = $(that).data('href');
      //  console.log(title + ' ' + href)
        if (!title || title == undefined)
          return null;
        if (!href || href == undefined)
          return null;
        var inx = HYLTAB.getTabIndexByTitle(title);
        if (inx == -1) {
          ddid = HYLTAB.createTab(title, href);         
          if (ddid) {        
            creatIframe(ddid, title, href, true);
            clear(ddid);
          }
        } else {
          var obj = HYLTAB.getTabByIndex(inx);
          directMenu(obj.id);
        }
      });
    });
   
    //刷新后重新载入完成
    $(document).ready(function() {
     // HYLTAB.save();
     //载入缓存
      HYLTAB.loadTabs();
     //创建iframe
      for (var i = 0; i < HYLTAB.getLength(); i++) {
        var obj = HYLTAB.getTabByIndex(i);
        var id = obj.id;
        var flag = (id > 100);
        creatIframe(id, obj.title, obj.url, flag);
      }
     //定位到指定页
      directMenu( HYLTAB.selectmenu);
      //修改右区高度 
    //  console.log( "xuanzong+"+HYLTAB.selectmenu);
      $('.page-content div').height(hei);
      
      //选中li a标签的点击事件
      $("#inbox-tabs").on("click", "li a", function(e) {
        var ddid = $(this).data("ddid");
        directMenu(ddid);
      });
      //选中li a i标签的点击事件
      $("#inbox-tabs").on("click", "li a i", function(e) {      
        var ddid = $(this).parent('a').data("ddid");
        deletehtml(ddid);
        e.stopPropagation();
      });
    });
  });
  
  document.documentElement.addEventListener('touchstart', function (event) {
		if (event.touches.length > 1) {
			event.preventDefault();
		}
	}, false);
</script>